<template>
	<view>
		<u-swipe-action
			:show="item.show" 
			:index="index" 
			v-for="(item, index) in list" 
			:key="item.id"
			:options="options"
			@click="click" 
			@open="open">
			<view class="item u-border-bottom">
				<text class="u-line-2">{{ item.name }}</text>
			</view>
		</u-swipe-action>
	</view>
</template>

<script>
	import { mapState } from 'vuex'
	
	export default {
		data() {
			return {
				list: [
					{
						id: 1,
						name: '长安回望绣成堆，山顶千门次第开，一骑红尘妃子笑，无人知是荔枝来',
						show: false
					},
					{
						id: 2,
						name: '新丰绿树起黄埃，数骑渔阳探使回，霓裳一曲千峰上，舞破中原始下来',
						show: false
					},
					{
						id: 3,
						name: '登临送目，正故国晚秋，天气初肃。千里澄江似练，翠峰如簇',
						show: false,
					}
				],
				options: [
					{
						text: '删除',
						style: {
							backgroundColor: '#dd524d'
						}
					}
				]
			}
		},
		computed: {
			...mapState('user', ['userId'])
		},
		methods: {
			click(index) {
				this.list.splice(index, 1);
				this.$u.toast(`删除成功`);
			},
			open(index) {
				this.list[index].show = true;
				this.list.map((val, idx) => {
					if(index != idx) this.list[idx].show = false;
				})
			}
		},
		created() {
			// this.$myRequest({
			// 	url: '/food/love/' + this.userId
			// })
		}
	}
	
	class Love{
		constructor(food, show) {
			this.food = food
		    this.show = show
		}
	}
</script>

<style>
</style>
